<template>
<div>

  <div class="login">
    <el-form :model="UserUpdateList" label-width="80px" class="login-box">
      <h3 class="login-title">用户修改</h3>
     

      <el-form-item label="用户名" prop="userName">
        <el-input type="text" placeholder="请输入新的用户名"  v-model="UserUpdateList.userName" />
      </el-form-item>
      <el-form-item label="账号" prop="loginName">
        <el-input type="text" placeholder="请输入新的账号" v-model="UserUpdateList.loginName" />
      </el-form-item>
      <el-form-item label="密码" prop="loginPswd">
        <el-input type="text" placeholder="请输入新的密码" v-model="UserUpdateList.loginPswd" />
      </el-form-item>

      <el-form-item label="vip" prop="vip">
        <el-switch v-model="UserUpdateList.vip" active-text="是" inactive-text="否"></el-switch>

      </el-form-item>
       <el-form-item label="余额" prop="balance">
        <el-input type="text" placeholder="请输入余额" v-model="UserUpdateList.balance" />
      </el-form-item>
 

    
         
        <el-button type="primary" @click="update()" >修改</el-button>
        <router-link to="/admin/manageUsers"> <el-button type="primary" >返回</el-button></router-link>
     
    </el-form>
</div>

</div>
  
</template>

<script>

export default {
  name:"UserUpate",

  data() {
    return {
      //这个属性用于得到要修改的用户ID进行操作
      updateId:'',
      UserUpdateList:{
            id:'',
            userName:'',
            loginName:'',
            loginPswd:'',
            registrationDate:'',
            vip:'',
            balance:''


      }
      
    }
  },mounted(){
    this.getupatedata();
  },methods:{
    //用于修改数据的回显
    getupatedata:function(){
    this.updateId=this.$route.params.updateId;
    this.$axios.get("/user/getupdate",{params:{id:this.updateId}}).then(res=>{
      this.UserUpdateList=res.data
      console.log(this.UserUpdateList)
    })
  
    },
    update:function(){
      console.log(this.UserUpdateList);
      //用axios的get方法不知道什么原因，报400报错，后端不报错，但后端无法接到前端传的值，但一个一个就可以传到值 
      var admin=localStorage.getItem("admin");
      this.$axios.get("/user/updateUser",{params:{id:this.UserUpdateList.id,userName:this.UserUpdateList.userName,loginName:this.UserUpdateList.loginName,loginPswd:this.UserUpdateList.loginPswd,vip:this.UserUpdateList.vip,balance:this.UserUpdateList.balance,admin:admin}}).then(res=>{
         
          this.$router.push({path:'/admin/manageUsers',params:alert(res.data)})
      })
    }
  }
}
</script>

<style>
.login-box {
  border: 1px solid #DCDFE6;
  width: 600px;
  margin: 180px auto;
  padding: 35px 35px 15px 35px;
  border-radius: 5px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  box-shadow: 0 0 25px #909399;
  position: absolute;
  top:-175px;
  left: 3px;
}

.login {
  max-width:600px;
  margin: 60px auto;
  background: #fff;
  padding: 20px 40px;
  border-radius: 10px;
  position: relative;
  z-index: 9;
 
}



</style>